<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="css/bootstrap.min.css">

	<!-- Loding font -->
	<link href="https://fonts.googleapis.com/css?family=Montserrat:300,700" rel="stylesheet">

	<!-- Custom Styles -->
	<link rel="stylesheet" type="text/css" href="css/withdrawStyles.css">

	<title>Take-Number</title>
</head>

<body>

	<!-- Backgrounds -->

	<div id="service-bg" class="container-fluid">
		<div class="bg-img"><img src="image/withdraw-bg.jpg"></div>
		<button id="service-stop" class="btn btn-danger">停止服务</button>
	</div>

	<!-- End Backgrounds -->



	<div class="container" id="service">
		<div class="row justify-content-center">
			<div class="col-lg-8">
				<div class="service">
					<!-- Front Page -->
					<div class="take-number">
						<h1>取号机 No.1</h1>
						<h4>目前状态：<b id="running">正在运行</b></h4>
						<div class="buttons">
							<div>
								<button class="btn btn-primary">普通业务</button>
							</div>
							<div>
								<button class="btn btn-warning">VIP业务</button>
							</div>
							<div>
								<button class="btn btn-danger">对公业务</button>
							</div>
						</div>
					</div>
					<!-- End Front Page -->
					<!-- Number Page -->
					<div class="show-number" style="display: none;">
						<div class="back">&lt;&lt;返回<br>
							(<span class="return-second">10</span>s)
						</div>
						<h1>欢迎光临本银行</h1>
						<h3>主办业务：<b id="service-type">VIP业务</b></h3>
						<div class="info">
							<div class="number">
								排队号码：<span class="current-number">1</span>
							</div>
							<div class="queue-status">
								您的前面还有 <span class="waiting-number">0</span> 人排队，请耐心等候！
							</div>
							<div class="inform">
								请留心叫号<br>
								过号作废!
							</div>
						</div>
					</div>
					<!-- End Number Page -->
					<!-- System Mainenance -->
					<div class="system-pause" style="display: none;">
						<h1>取号机 No.1</h1>
						<h4>目前状态：<b id="stop">暂停服务</b></h4>
						<div class="buttons">
							<div>
								<button id="service-start" class="btn btn-success">启动服务</button>
							</div>
							<div>
								<button class="btn btn-danger">故障上报</button>
							</div>
						</div>
					</div>
					<!-- End System Mainenance -->
					<!-- Identity Check -->
					<div class="id-scan" style="display: none;">
						<div class="back">&lt;&lt;返回<br>
							(<span class="return-second">30</span>s)
						</div>
						<h1>请扫描员工卡</h1>
						<h4>身份验证中......</h4>
						<div class="scan-area">
							<img id="id-card" src="image/ID-Card.png">
						</div>
						<div class="check-pass">验证通过</div>
					</div>
					<!-- End Identity Check -->
				</div>
				<div class="system-time">
					当前系统时间：<span id="system-time"></span>
				</div>
			</div>
		</div>
	</div>


	<script src="js/jquery-1.11.0.min.js"></script>
	<script src="js/withdrawMain.js"></script>
</body>


</html>